<div class="td-patient-me-order">
    <mt-header fixed title="订单管理">
        <router-link to="tdPatientMe" slot="left">
            <mt-button icon="back"></mt-button>
        </router-link>
    </mt-header>

    <mt-navbar v-model="selected" :fixed="true">
        <mt-tab-item id="-1" @click.native="GetUserOrderInfoList">全部</mt-tab-item>
        <mt-tab-item id="0" @click.native="GetUserOrderInfoList">
            待付款
            <!--未支付-->
        </mt-tab-item>
        <mt-tab-item id="1" @click.native="GetUserOrderInfoList">
            已完成
            <!--支付成功-->
        </mt-tab-item>
        <mt-tab-item id="2" @click.native="GetUserOrderInfoList">
            已取消
            <!--支付失败-->
        </mt-tab-item>
        <mt-tab-item id="3" @click.native="GetUserOrderInfoList">
            退款中
            <!--退款中-->
        </mt-tab-item>
        <mt-tab-item id="4" @click.native="GetUserOrderInfoList">
            已退款
            <!--已退款-->
        </mt-tab-item>
    </mt-navbar>

    <div class="list" v-if="orderList.length!==0">
        <div class="item" v-for="(item,index) in orderList" :key="index">
            <h2>
                {{utils$.convertData(item.CreateTime,3)}}
                <el-tag v-if="item.PayStatus===0" type="warning">未支付</el-tag>
                <el-tag v-if="item.PayStatus===1" type="success">支付成功</el-tag>
                <el-tag v-if="item.PayStatus===2" type="info">支付失败</el-tag>
                <el-tag v-if="item.PayStatus===3" type="danger">退款中</el-tag>
                <el-tag v-if="item.PayStatus===4">已退款</el-tag>
            </h2>

            <!-- <el-alert v-if="item.PayStatus===0 && timeoutFormat(item)" :title="`此订单过期时间为：${timeoutFormat(item,1)}，请尽快完成支付！`" type="warning" :closable="false"></el-alert>

            <el-alert v-if="item.PayStatus===0 && !timeoutFormat(item)" title="此订单已超时15分钟，无法再次支付，请重新下单！" type="warning" :closable="false"></el-alert> -->

            <div class="order-item">
                订单号：{{item.OrderNumber}}
                <el-tag v-if="item.ReportStatus===0" type="danger">待报告</el-tag>
                <el-tag v-if="item.ReportStatus===1" type="info">部分报告</el-tag>
                <el-tag v-if="item.ReportStatus===2" type="success">完成报告</el-tag>
            </div>
            <div class="order-item">主治医师：{{item.DoctorName}}</div>
            <div class="order-item">采样医院：{{item.HospitalName}}</div>
            <div class="order-item">配偶姓名：{{item.MateName}}</div>
            <div class="order-item">订单金额：{{utils$.subTransfer(item.TotalFee)}}&nbsp;元</div>
            <p class="order-item-pay" v-if="item.PayStatus===0">
                <el-button round size="mini" type="primary" @click="btnPay(item);">支付</el-button>
            </p>
            <p class="order-item-detail" @click="showDetail(item)">
                订单详情
                <i class="fa fa-angle-right"></i>
            </p>
        </div>
    </div>

    <div class="tip" v-if="orderList.length===0">您没有相关订单</div>

    <mt-popup v-model="showOrder" position="bottom" class="mint-popup-3" :modal="false">
        <i class="icon font_family icon-td-icon_off" @click="showOrder=false"></i>
        <div class="list">
            <div class="item">
                <h2>
                    {{utils$.convertData(orderItem.CreateTime,3)}}
                    <el-tag v-if="orderItem.PayStatus===0" type="warning">未支付</el-tag>
                    <el-tag v-if="orderItem.PayStatus===1" type="success">支付成功</el-tag>
                    <el-tag v-if="orderItem.PayStatus===2" type="info">支付失败</el-tag>
                    <el-tag v-if="orderItem.PayStatus===3" type="danger">退款中</el-tag>
                    <el-tag v-if="orderItem.PayStatus===4">已退款</el-tag>
                </h2>

                <!-- <el-alert v-if="orderItem.PayStatus===0 && timeoutFormat(orderItem)" :title="`此订单过期时间为：${timeoutFormat(orderItem,1)}，请尽快完成支付！`" type="warning" :closable="false"></el-alert>

                <el-alert v-if="orderItem.PayStatus===0 && !timeoutFormat(orderItem)" title="此订单已超时15分钟，无法再次支付，请重新下单！" type="warning" :closable="false"></el-alert> -->

                <div class="order-item">
                    订单号：{{orderItem.OrderNumber}}
                    <el-tag v-if="orderItem.OrderStatus===0" type="danger">待采样</el-tag>
                    <el-tag v-if="orderItem.OrderStatus===1" type="info">已回邮</el-tag>
                    <el-tag v-if="orderItem.OrderStatus===2" type="success">待送检</el-tag>
                    <el-tag v-if="orderItem.OrderStatus===3" type="warning">待报告</el-tag>
                    <el-tag v-if="orderItem.OrderStatus===4">完成报告</el-tag>
                </div>
                <div class="order-item">主治医师：{{orderItem.DoctorName}}</div>
                <div class="order-item">采样医院：{{orderItem.HospitalName}}</div>
                <div class="order-item">配偶姓名：{{orderItem.MateName}}</div>
                <div class="order-item">订单金额：{{utils$.subTransfer(orderItem.TotalFee)}}&nbsp;元</div>
                <div v-for="(item,index) in orderItem.ItemTestList" :key="index">
                    <div class="order-item">
                        {{item.ItemName}}：
                        <span style="color:#FF7983">({{item.IsMan===0?'女':'男'}})</span>
                    </div>
                    <div class="order-item order-test-item" v-for="(items,j) in item.TestItemDetail" :key="j">
                        <p>{{items.TestItemName}}</p>
                        <p>{{utils$.subTransfer(items.TestItemPrice)}}元</p>
                    </div>
                </div>
                <p class="order-item-pay" v-if="orderItem.PayStatus===0">
                    <el-button round size="mini" type="primary" @click="btnPay(orderItem);">支付</el-button>
                </p>
            </div>
        </div>
    </mt-popup>
</div>